Ext.ns('App.HeadPanel', 'App.ModulePanel', 'App.MainPanel');

/* --------------------------- HeadPanel: start ------------------------- */

var btnUser = new Ext.Toolbar.SplitButton({
			text	: '用户菜单',
			iconCls	: 'user',
			menu	: {
				items	: [{
							text	: '忘记密码',
							iconCls	: 'lock-go',
							handler	: function() {
								var tabPanel = Ext.getCmp('mainPanel');
								var node = new Ext.tree.TreeNode({
											id		: 'retrieve-pwd',
											text	: '忘记密码',
											url		: './page/employee/index.html',
											leaf	: true
										});

								tabPanel.loadModule(node);
							}
						}, {
							text	: '修改信息',
							iconCls	: 'user-edit',
							handler	: function() {}
						}]
			}
		});

var btnSys = new Ext.Toolbar.SplitButton({
			text	: '系统菜单',
			iconCls	: 'computer',
			menu	: {
				items	: [{
							text	: '数据库备份',
							iconCls	: 'database-gear'
						}, {
							text	: '偏好设置',
							iconCls	: 'wrench'
						}, {
							text	: '帮助',
							iconCls	: 'help',
							handler	: function() {}
						}]
			}
		});

App.HeadPanel = function() {

	App.HeadPanel.superclass.constructor.call(this, {
				border		: false,
				region		: 'north',
				margins		: '0 0 2 0',
				autoHeight	: true,
				items		: [new Ext.Toolbar({
							items	: ['&nbsp;&nbsp;', {
										iconCls	: 'calendar'
									}, '&nbsp;', {
										xtype	: 'label',
										text	: new Date().format('Y-m-d')
									}, '&nbsp;&nbsp;', '登录人: 吴可凡  所属部门: 人事',
									'->', btnUser, btnSys, {
										text	: '注销',
										iconCls	: 'key-go'
									}]
						})]
			});
};

Ext.extend(App.HeadPanel, Ext.Panel, {});

/* --------------------------- HeadPanel: end ------------------------- */

/* --------------------------- ModulePanel: start ------------------------- */

App.ModulePanel = function() {

	App.ModulePanel.superclass.constructor.call(this, {
				region				: 'west',
				split				: true,
				width				: 280,
				minSize				: 280,
				maxSize				: 500,
				collapsible			: true,
				border				: false,
				margins				: '0 0 5 5',
				cmargins			: '0 0 0 0',
				autoScroll			: true,
				containerScroll		: true,
				animCollapse		: true,
				animate				: true,
				hideCollapseTool	: true,// hide trigger button
				collapseMode		: 'mini'
			});
};

App.ModulePanel.SubModulePanel = function(config) {

	Ext.apply(this, config);

	App.ModulePanel.SubModulePanel.superclass.constructor.call(this, {
				autoScroll	: true,
				collapsible	: true,
				rootVisible	: false,
				useArrows	: true,
				style		: 'margin:0 0 5 0',
				bodyStyle	: 'padding:5',
				root		: new Ext.tree.AsyncTreeNode(),
				loader		: new Ext.tree.TreeLoader({
							requestMethod	: 'GET',
							url				: config.url
						})
			});

	this.on({
				'click'	: {
					scope	: this,
					fn		: this.onClick
				}
			});
}

Ext.extend(App.ModulePanel.SubModulePanel, Ext.tree.TreePanel, {
			onClick	: function(node, e) {
				Ext.getCmp('mainPanel').loadModule(node);
			}
		});

Ext.extend(App.ModulePanel, Ext.Panel, {
			initComponent	: function() {
				Ext.apply(this, {
							items	: [
									new App.ModulePanel.SubModulePanel({
												title	: '销售',
												iconCls	: 'coins',
												url		: './sales.json'
											}),
									new App.ModulePanel.SubModulePanel({
												title	: '市场',
												iconCls	: 'chart-pie',
												url		: './market.json'
											}),
									new App.ModulePanel.SubModulePanel({
												title	: '服务',
												iconCls	: 'medal-gold-1',
												url		: './service.json'
											}),
									new App.ModulePanel.SubModulePanel({
												title	: '活动',
												iconCls	: 'map',
												url		: './activity.json'
											}),
									new App.ModulePanel.SubModulePanel({
												title	: '协作',
												iconCls	: 'group',
												url		: './collaboration.json'
											}),
									new App.ModulePanel.SubModulePanel({
												title	: '报表',
												iconCls	: 'report',
												url		: './report.json'
											})]
						})

				App.ModulePanel.superclass.initComponent.call(this);
			}
		});

/* --------------------------- ModulePanel: end ------------------------- */

/* --------------------------- MainPanel: start ------------------------- */

App.MainPanel = function() {

	App.MainPanel.superclass.constructor.call(this, {
				id				: 'mainPanel',
				region			: 'center',
				margins			: '0 5 5 0',
				resizeTabs		: true,
				minTabWidth		: 135,
				tabWidth		: 135,
				plugins			: new Ext.ux.TabCloseMenu(),
				enableTabScroll	: true,
				activeTab		: 0,
				items			: {
					id			: 'tab-root',
					title		: '企业应用平台',
					iconCls		: 'book',
					autoLoad	: {
						url		: 'welcome.html',
						scope	: this
					},
					autoScroll	: true
				}
			});
};

Ext.extend(App.MainPanel, Ext.TabPanel, {

			loadModule	: function(node) {
				var title = node.attributes.text;
				var url = node.attributes.url;
				var leaf = node.attributes.leaf;
				if (leaf == 1) {
					var tab = this.getComponent('tab-' + node.id);
					if (!tab) {
						tab = this.add(new Ext.Panel({
									id			: 'tab-' + node.id,
									title		: title,
									layout		: 'fit',
									closable	: true,
									autoLoad	: {
										url		: url,
										scripts	: true
									}
								}));
					}

					this.setActiveTab(tab);
				}
			},
			addTab		: function(panel) {
				var tab = this.getComponent('tab-' + panel.id);
				if (!tab) {
					tab = this.add(panel);
				}

				this.setActiveTab(tab);
			},
			addTabByUrl	: function(config) {
				var tab = this.getComponent('tab-' + config.id);
				if (!tab) {
					tab = this.add(new Ext.Panel({
								id			: 'tab-' + config.id,
								title		: config.title,
								closable	: true,
								autoScroll	: true,
								autoLoad	: {
									url		: config.url,
									scripts	: true
								}
							}));
				}

				this.setActiveTab(tab);
			}
		});

/* --------------------------- MainPanel: end ------------------------- */